import React from 'react'
import { Carousel} from 'antd-mobile';
import {get} from 'api/http'

export default  class App extends React.Component {
  state = {
    data: [],
    imgHeight: 176,
  }

  async  getSwiper(){
    let rs = await get('/api/swiper')
    console.log(rs);
    this.setState({
        data:rs.data.datalist
    })
}

  componentDidMount() {
    // simulate img loading
    // setTimeout(() => {
    //   this.setState({
    //     data: ['AiyWuByWklrrUDlFignR', 'TekJlZRVCjLFexlOCuWn', 'IJOtIlfsYdTyaDTRVrLI'],
    //   });
    // }, 100);
    this.getSwiper()
  }

 

  render() {
    return (
        <Carousel
          autoplay={true}
          infinite={true}
        >
          {this.state.data.map((val,index) => (
              <img
              key="index"
                src={val.img}
                alt={index}
                style={{ width: '100%', verticalAlign: 'top' }}
                onLoad={() => {
                  this.setState({ imgHeight: 'auto' });
                }}
              />
            
          ))}
        </Carousel>

    );
  }
}